<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>进度控制</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script src="${pageContext.request.contextPath}/js/echarts.min.js"></script>
	
  </head>
  
  <body>
    <c:import url="admin_home.jsp"></c:import>
    
    <!-- 隐藏域 -->
    
    <input type="hidden" id="hidden_lastDate" value="${last_date}">
    
    <!-- 中期检查 Modal -->
			<div class="modal fade bs-example-modal-lg" id="middle_check_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
			  <div class="modal-dialog" style="margin-right: 1000px" role="document">
			    <div class="modal-content">
			      <div class="modal-header">
			        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
			        <h4 class="modal-title" id="myModalLabel">中期检查</h4>
			      </div>
			      <div class="modal-body">
			        <form class="form-horizontal" id="middleCheck_form">
			        	<input type="hidden" id="projectId" name="projectId" value="">
			        	<div class="form-group">
			        		<label  class="col-sm-3 control-label">检查时间</label>
						    <div class="col-sm-5">
						    	<input type="text" class="layui-input" id="check_time" name="check_time" placeholder="选择检查时间">
						    </div>
				      </div>
				      <div class="form-group">
			        		<label  class="col-sm-3 control-label">检查地点</label>
						    <div class="col-sm-5">
						    	<input type="text" class="form-control" id="check_address" name="check_address" placeholder="输入检查地点">
					    		<span id="helpBlock2" class="help-block"></span>
						    </div>
				      </div>
					  <div class="form-group">
					    <label  class="col-sm-3 control-label" placeholder="输入检查要求...">检查要求</label>
					    <div class="col-sm-8">
					      <textarea id="check_require" name="check_require" class="form-control" rows="3" placeholder="请输检查要求..."></textarea>
					    	
					    </div>
					  </div>
					</form>
			      </div>
			      <div class="modal-footer">
			        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
			        <button type="button" class="btn btn-primary" id="btn_check">确定</button>
			      </div>
			    </div>
			  </div>
			</div>
    <div class="layui-body">
    <div class="layui-container" >
    	<!-- 搜索框 -->
     		<div class="layui-row" style="margin-top: 75px">
     			<form class="layui-form" action="#">
     				<div class="layui-form-item">
					      <div class="layui-input-inline layui-col-md-offset2 layui-col-md2">
					     	<input type="text" id="projectName" name="projectName" lay-verify="required" placeholder="输入项目名称" autocomplete="off" class="layui-input">
					      </div>
					      <div class="layui-col-md1">
					      	<button type="button" class="btn btn-info">查询</button>	
					      </div>
					</div>
				</form>
     		</div>
     	<div class="layui-row">
     	<c:if test="${pageInfo==null}">
				${errorMsg}
		</c:if>
		<c:if test="${pageInfo!=null}">
			<c:forEach items="${pageInfo.list}" var="pro">
			<input type="hidden" id="hidden_createTime" value="${pro.project.createTime}">
	    	<div class="layui-col-md8 layui-col-md-offset2">
				<div class="panel panel-default">
				  <div class="panel-heading">
				  	<form class="form-horizontal">
				    <div class="form-group" style="font-size: 16px" align="left">
					  	<label class="col-sm-3 control-label">
					  		${pro.project.projectName}
					  	</label>
					  	
					  	<div class="col-md-offset-6" align="left">
					  		<p class="form-control-static">
					  			<a href="javascript:void(0)" onclick="gitPutInfo('${pro.project.projectId}')">
					  				<img class="layui-nav-img" alt="git" src="${pageContext.request.contextPath}/img/git/git.png">
					  				代码提交情况</a>
					  			&nbsp;&nbsp;&nbsp;
					  		
					  		<c:if test="${pro.checkProject==null and middleCheck==null}">
					  		<i class="layui-icon" style="font-size: 30px; color:cc0000;">&#xe6b2;</i>&nbsp;
					  			<a href="javascript:void(0)" onclick="a_middle_check()">
					  			
					  			中期检查
					  			 
					  			</a>
					  		</c:if>
					  		<c:if test="${middleCheck.check_status==0}">
					  			<i class="layui-icon" style="font-size: 30px; color:cc0000;">&#xe756;</i>&nbsp;
					  			<a href="javascript:void(0)">
					  			 
					  			待检查</a>
					  		</c:if>
					  		<c:if test="${middleCheck.check_status==1}">
					  			<i class="layui-icon" style="font-size: 30px; color:cc0000;">&#xe6af;</i>&nbsp;
					  			<a href="javascript:void(0)">
					  			 
					  			通过中期检查</a>
					  		</c:if>
					  		<c:if test="${middleCheck.check_status==2}">
					  			<i class="layui-icon" style="font-size: 30px; color:cc0000;">&#xe69c;</i> &nbsp;
					  			<a href="javascript:void(0)">
					  			
					  			未通过中期检查</a>
					  		</c:if>
					  		</p>
					  	</div>
				  	</div>
				  	</form>
				  </div>
				  <div class="panel-body">
				  	<form class="form-horizontal">
				    <div class="form-group">
							<label class="col-sm-2 control-label">项目名称:</label>
							<div class="col-sm-3">
								<p class="form-control-static">
								${pro.project.projectName}</p>
							</div>
							<label class="col-sm-2 control-label">项目状态:</label>
							<div class="col-sm-3">
								<p class="form-control-static">
								<c:choose>
									<c:when test="${pro.project.projectStatus==0}">
										验收完成
									</c:when>
									<c:when test="${pro.project.projectStatus==1}">
										申报成功
									</c:when>
									<c:when test="${pro.project.projectStatus==2}">
										提交需求
									</c:when>
									<c:when test="${pro.project.projectStatus==8}">
										编码完成
									</c:when>
									<c:when test="${pro.project.projectStatus==9}">
										测试中···
									</c:when>
									<c:otherwise>
										编码中···
									</c:otherwise>
								</c:choose>
								</p>
							</div>
							<input type="hidden" id="panel_projectId" value="${pro.project.projectId}">
						</div>
						<div class="form-group">
							<label class="col-sm-2 control-label">项目组长:</label>
							<div class="col-sm-2">
								<p class="form-control-static">
								${pro.group.leaderName}</p>
							</div>
							<label class="col-sm-2 control-label">团队名称:</label>
							<div class="col-sm-3">
								<p class="form-control-static">
								${pro.group.groupName}</p>
							</div>
						</div>
						<div class="form-group">
							
							<label class="col-sm-2 control-label">立项时间:</label>
							<div class="col-sm-2">
								<p class="form-control-static">
								${pro.project.createTime}</p>
							</div>
							<label class="col-sm-2 control-label">预计完成时间:</label>
							<div class="col-sm-2">
								<p class="form-control-static">
								${pro.project.finishTime}</p>
							</div>
							<label class="col-sm-2 control-label">延期时间:</label>
							<div class="col-sm-2">
								<p class="form-control-static">
									<c:if test="${empty pro.project.update_finishTime}">
										为延期
									</c:if>
									<c:if test="${not empty pro.project.update_finishTime}">
										${pro.project.update_finishTime}
									</c:if>
								</p>
							</div>
						</div>
						
						<!-- 项目进度 -->
						<div class="form-group">
							<div class="col-sm-12" id="map_projectProgress" style="width: 1500px;height:400px;"></div>
						</div>
						<!-- 任务进度 -->
						<div class="form-group">
							<div class="col-sm-8 col-md-offset-1" id="map_taskProgress" style="width: 550px;height:350px;"></div>
						</div>
						<!-- 房间使用情况 -->
						<div class="form-group">
							<div class="row" style="margin-bottom: 10px">
								<div class="col-md-offset-2" style="font-size:20px;">日期</div>
								<div class="col-md-3">
									<input type="text" class="layui-input" id="check_date" style="width: 200px;margin: 0 auto;">
								</div>
								<div class="col-md-offset-1" style="font-size:20px;">时间段</div>
								<div class="col-md-3">
									<select id="range_date" class="form-control" style="height: 37px">
										<option value="-1">无</option>
									  <option value="0">所有</option>
									  <option value="1">最近一月</option>
									  <option value="2">最近10日</option>
									</select>
								</div>
							</div>
							<div class="col-sm-8 col-md-offset-1" id="map_roomUse" style="width: 550px;height:350px;"></div>
						</div>
					</form>
				  </div>
				  
				  <!-- 中期检查 -->
				  <div class="row">
				  	<c:if test="${middleCheck!=null}">
				  		<c:if test="${middleCheck.check_status==0}">
				  			<form class="form-horizontal  col-sm-8 col-md-offset-1">
			  					<input type="hidden" id="show_check_time" value="${middleCheck.check_time}"> 
								<fieldset>
				    				<legend>中期审查信息</legend>
							    	<div class="form-group">
										<label class="col-sm-4 control-label">检查时间:</label>
										<div class="col-sm-8">
											<p class="form-control-static">
											${middleCheck.check_time}</p>
										</div>
				    				</div>
				    				<div class="form-group">
										<label class="col-sm-4 control-label">检查地点:</label>
										<div class="col-sm-8">
											<p class="form-control-static">
											${middleCheck.check_address}</p>
										</div>
				    				</div>
				    				<div class="form-group">
										<label class="col-sm-4 control-label">检查要求:</label>
										<div class="col-sm-8">
											<p class="form-control-static">
											  ${middleCheck.check_require}
											
											</p>
										</div>
				    				</div>
				    				<div class="form-group">
										<label class="col-sm-4 control-label">检查结果:</label>
										<div class="col-sm-8">
											<p class="form-control-static">
												<c:if test="${middleCheck.check_status==0}">
													<label class="radio-inline">
													  <input type="radio" name="radio_check_status"  value="1" checked>通过
													</label>
													<label class="radio-inline">
													  <input type="radio" name="radio_check_status"  value="2">驳回
													</label>
													&nbsp;<button id="btn_checkStatus" type="button" class="btn btn-success">提交</button>
												</c:if>
												<c:if test="${middleCheck.check_status==1}">中期检查通过</c:if>
												<c:if test="${middleCheck.check_status==2}">中期检查未通过</c:if>
											</p>
										</div>
				    				</div>
				    			</fieldset>
				    		</form>	
				  		</c:if>
				  	</c:if>
				  	
				  </div>
				</div>
				    
			</div>
			</c:forEach>
		</c:if>
	  	</div>
	  	<div class="row">
				<div class="row col-sm-7 col-md-offset-5">
					共${pageInfo.total}条任务记录
				</div>
				<nav aria-label="Page navigation" class="col-sm-8 col-md-offset-2">
				  <ul class="pager">
				    <li class="previous"><a href="${pageContext.request.contextPath}/admin/progressControl.do?pageNum=${pageInfo.pageNum-1}"><span aria-hidden="true">&larr;</span> Older</a></li>
				    <li class="next"><a href="${pageContext.request.contextPath}/admin/progressControl.do?pageNum=${pageInfo.pageNum+1}">Newer <span aria-hidden="true">&rarr;</span></a></li>
				  </ul>
				</nav>

		</div>
     </div>
    </div>
<script type="text/javascript">

//日期选择
layui.use('laydate', function(){
  var laydate = layui.laydate;
  
  //执行一个laydate实例
  laydate.render({
    elem: '#check_time' //指定元素
    ,min:getNowDay()
    ,type: 'datetime'
  });
});

layui.use('laydate', function(){
  var laydate = layui.laydate;
  
  //执行一个laydate实例
  laydate.render({
    elem: '#check_date' //指定元素
    ,value:$("#hidden_lastDate").val()
    ,min:$("#hidden_createTime").val()
    ,max:getNowDay()
    ,done: function(value, date, endDate){
    	console.log(value);
    	console.log("立项时间："+$("#hidden_createTime").val());
    	console.log("最新时间："+$("#hidden_lastDate").val());
    	selectRoomUse_day(value);
    }
  });
});
//获取当前时间(yyyy-MM-dd hh:mm:ss)
function getNowDay(){
	var now_day=new Date();
	var day=now_day.getDate();
	var month=now_day.getMonth()+1;
	var year=now_day.getFullYear();
	var hours=now_day.getHours();
	var minutes=now_day.getMinutes();
	var seconds=now_day.getSeconds();
	var now_day_String=year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
	console.log("now_day_String:"+now_day_String);
	return now_day_String;
}
//项目进度表
var project_map = echarts.init(document.getElementById('map_projectProgress'));
var project_option = {
		title: {
	        text: '项目进度'
	    },
	    tooltip: { 
	    	trigger:'axis',
	        formatter: '{b}:<br/>完成{c}%'
	    },
	    xAxis: {
	        type: 'category',
	        boundaryGap: false,
	        axisLabel:{
	        	margin:10,
                rotate:30,
                interval:1
            },
	        data: []
	    },
	    yAxis: {
	        type: 'value',
	        axisLabel: {   
	            formatter: '{value} %'  
	          },
	    },
	    series: [{
	        data: [],
	        type: 'line'
	    }]
	};
project_map.setOption(project_option);
$.get('${pageContext.request.contextPath}/admin/getProject_map.do?projectId='+$("#panel_projectId").val())
.done(function(result){
	console.log(result);
	if(result.code==100){
		project_map.setOption({
			xAxis:{
				data:result.extend.categories
			},
			series:[{
				data:result.extend.data
			}]
		});
	}else{
		layer.msg('项目进度数据获取失败!', {icon: 2});
	}
	
});
//任务进度表 
var task_map = echarts.init(document.getElementById('map_taskProgress'));
var task_option = {
    title: {
        text: '任务进度'
    },
    tooltip: { 
        formatter: '123<br />{b}:\n{c}%',
    },
    legend: {
        data:['完成量']
    },
    xAxis: {
        data: []
    },
    yAxis: {
    	axisLabel: {  
            show: true,  
            interval: 'auto',  
            formatter: '{value} %'  
          },
    },
    series: [{
        name: '完成量',
        type: 'bar',
        barMaxWidth: '50',
        itemStyle: {
            normal: {
              label: {
                show: true,
                position: 'inside',//数据在中间显示
                formatter:'{c}%'//百分比显示
              }
            }
          },
        data: []
    }]
};
task_map.setOption(task_option);
$.get('${pageContext.request.contextPath}/admin/getTasks_map.do?projectId='+$("#panel_projectId").val())
	.done(function(result){
		console.log(result);
		if(result.code==200){
			layer.msg('任务进度数据获取失败!', {icon: 2});
		}else{
			task_map.setOption({
				xAxis:{
					data:result.extend.categories
				},
				series:[{
					name:'完成量',
					data:result.extend.data
				}]
			});
		}
		
});



//房间使用情况
var room_map = echarts.init(document.getElementById('map_roomUse'));
var room_option = {
    title: {
        text: '房间使用情况'
    },
    tooltip: {},
    legend: {
        data:['实到人数']
    },
    xAxis: {
        data: []
    },
    yAxis: {
    	axisLabel: {  
            show: true,  
            interval: 'auto',  
            formatter: '{value}'  
          },
    },
    series: [{
        name: '房间使用情况',
        type: 'bar',
        barMaxWidth: '50',
        itemStyle: {
            normal: {
              label: {
                show: true,
                position: 'inside',//数据在中间显示
                formatter:'{c}'//百分比显示
              }
            }
          },
        data: []
    }]
};
room_map.setOption(room_option);
$.get('${pageContext.request.contextPath}/admin/getRoomUse_day.do?projectId='+$("#panel_projectId").val())
		.done(function(result){
			console.log(result);
			if(result.code==100){
				room_map.setOption({
					title: {
				        text: '房间使用情况'
				    },
				    tooltip: {},
				    legend: {
				        data:['实到人数']
				    },
					 yAxis: {
					    	axisLabel: {  
					            show: true,  
					            interval: 'auto',  
					            formatter: '{value}'  
					          },
					    },
					xAxis:{
						data:['9:00~10:00','16:00~17:00','19:00~20:00']
					},
					series:[{
						type: 'bar',
						name:'实到人数',
						barMaxWidth: '50',
						data:result.extend.nums
					}]
				});
			}else{
				layer.msg('房间使用情况数据获取失败!', {icon: 2});
			}
		});
//时间选择框
function selectRoomUse_day(date){
	$.get('${pageContext.request.contextPath}/admin/getRoomUse_day.do?projectId='+$("#panel_projectId").val()+'&date='+date)
	.done(function(result){
		console.log(result);
		console.log("lastdate:"+$("#last_date").val());
		if(result.code==100){
			room_map.clear();
			room_map.setOption({
				title: {
			        text: '房间使用情况'
			    },
			    tooltip: {},
			    legend: {
			        data:['实到人数']
			    },
				 yAxis: {
				    	axisLabel: {  
				            show: true,  
				            interval: 'auto',  
				            formatter: '{value}'  
				          },
				    },
				xAxis:{
					
					data:['9:00~10:00','16:00~17:00','19:00~20:00']
				},
				series:[{
					type: 'bar',
					name:'实到人数',
					barMaxWidth: '50',
					itemStyle: {
			            normal: {
			              label: {
			                show: true,
			                position: 'inside',//数据在中间显示
			                formatter:'{c}'//百分比显示
			              }
			            }
			          },
					data:result.extend.nums
				}]
			});
		}else{
			layer.msg('数据未录入!', {icon: 2,time:1000});
		}
	});
}
//范围下拉框
$("#range_date").change(function(){
	var state=$("#range_date").val();
	if(state>=0){
		$.get('${pageContext.request.contextPath}/admin/getRoomUse_range.do?projectId='+$("#panel_projectId").val()+'&state='+state)
		.done(function(result){
			console.log("range_date");
			console.log(result);
			if(result.code=100){
				var x_data=new Array(),s_data=new Array();
				$.each(result.extend.list,function(index,data){
					x_data.push(data.check_date);
					s_data.push(data.count);
				});
				room_map.setOption({
					 xAxis: {
						 	type: 'category',
					        boundaryGap: false,
					        axisLabel:{
					        	margin:5,
				                interval:1
				            },
					        data:x_data
					    },
					    series: [{
					        name: '实到人数',
					        type: 'line',
					        data: s_data
					    }]
				});
			}else{
				layer.msg('数据获取失败!', {icon: 2,time:1000});
			}
			
		});
	}
	
});

//弹出代码提交信息页面：gitPutInfo.jsp
function gitPutInfo(projectId){
	layer.open({
	      type: 2,
	      title:['代码提交信息','font-size:18px;'],
	      maxmin: true,
	      shadeClose: true, //点击遮罩关闭层
	      area : ['800px' , '600px'],
	      content: '${pageContext.request.contextPath}/admin/gitPutInfo.do?projectId='+projectId
	    });
}

 
// 弹出中期检查模态框
function a_middle_check(){
	$('#middle_check_Modal').modal('show');
}
//提交中期检查数据
$("#btn_check").click(function(){
	$("#projectId").val($("#panel_projectId").val());
	if($("#check_time").val()==""||$("#check_address").val()==""){
		layer.msg('检查时间和地点为必填项！', {icon: 2,time:2000});
		return;
	}
	$.ajax({
		url:"${pageContext.request.contextPath}/admin/setMiddle_check.do",
		type:"POST",
		data:$("#middleCheck_form").serialize(),
		success:function(result){
			console.log(result);
			if(result.code=100){
				$('#middle_check_Modal').modal("toggle");
				layer.msg('操作成功!', {icon: 1,time:2000,end:function(){
					location.reload();
				}});
			}else{
				layer.msg('操作失败.', {icon: 2,time:2000});
			}
		}
	});
	
});

//提交中期检查结果
$("#btn_checkStatus").click(function(){
	
	var status=$("input[name='radio_check_status']:checked").val();
	var checkTime=$("#show_check_time").val();
	var d1=new Date(Date.parse(checkTime));

	var nowTime=getNowDay();
	
	var d2=new Date(Date.parse(nowTime));
	console.log("d1:"+d1);
	console.log("d2:"+d2);
	console.log(d1>d2);
	if(d1>d2){
		console.log("时间未到");
		layer.msg('检查时间未到', {icon: 2});
		return;
	}
	console.log(status);
	console.log($("#panel_projectId").val());
	var str_status;
	if(status==1){
		str_status="确定此项目通过中期检查吗？";
	}else if(status==2){
		str_status="确定此项目不通过中期检查吗？";
	}
	layer.confirm(str_status, {
 		  btn: ['确定','取消'] //按钮
 		},function(){
 			$.get("${pageContext.request.contextPath}/admin/update_middleCheck.do?projectId="+$("#panel_projectId").val()+"&status="+status)
 			.done(function(result){
 				if(result.code=100){
 					layer.msg('操作成功!', {icon: 1,time:2000,end:function(){
 						location.reload();
 					}});
 				}else{
 					layer.msg('操作失败.', {icon: 2,time:2000});
 				}
 			});
 		},function(){
 			
 		});
	
});
</script>
  </body>
</html>
